<template>
  <div>
       <mt-swipe :auto="4000">
            <mt-swipe-item v-for="item in movie" :key="item.alt">
             <img :src="item.images.small" alt="item.alt">
            </mt-swipe-item>
            
        </mt-swipe>
        <ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/douban">
		                    <img src="../../images/menu1.png"/>
		                    <div class="mui-media-body">豆瓣电影</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/newlist">
		                   <img src="../../images/menu2.png"/>
		                    <div class="mui-media-body">新闻</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/goodslist">
		                   <img src="../../images/menu3.png"/>
		                    <div class="mui-media-body">购物车</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/tuku">
                          <img src="../../images/menu4.png"/>
		                    <div class="mui-media-body">美女图库</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
		                   <img src="../../images/menu5.png"/>
		                    <div class="mui-media-body">Search</div></a></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><a href="#">
		                    <img src="../../images/menu6.png"/>
		                    <div class="mui-media-body">Phone</div></a></li>

		        </ul>
      <button @click="show">111</button>
  </div>
</template>

<script>
export default {
    data() {
      return {
        movie:[],
      }
    },
    methods:{
        getLunbotu(){
          var url='https://api.douban.com//v2/movie/top250?start=25&count=5' // 搞了一个豆瓣api
      this.$http.jsonp(url, {}, {headers: {},emulateJSON: true }).then((response) => {
        this.movie = response.data.subjects;
        //console.log(this.movie.subjects);
      });
            },
            show(){
              console.log(this.movie)
            }
    },
    created() {
      this.getLunbotu()
    },

};
</script>

<style lang="scss" scoped>
  .mint-swipe{
        height:200px;
        .mint-swipe-item{
            &:nth-child(1){
                background: red;
            }
            &:nth-child(2){
                background: blue;
            }
            &:nth-child(3){
                background: cyan;
            }
        }
    }
    img{
        width:100%;
        height: 100%;
    }
    .mui-grid-view.mui-grid-9{
        background: #fff;
    }
    .mui-grid-view.mui-grid-9 .mui-table-view-cell{
         border: none;
        img{width: 80%;height: auto;};
       
    }
</style>


